<template>
    <div class="home">
        <main>
            <router-view></router-view>
        </main>
        <footer>
            <van-tabbar v-model="active">
                <van-tabbar-item icon="gem-o" to='/'>首页</van-tabbar-item>
                <van-tabbar-item icon="comment-o" to='/ding'>分类</van-tabbar-item>
                <van-tabbar-item icon="cart-o" to='/shopcar'>购物车</van-tabbar-item>
                <van-tabbar-item icon="manager-o" to='/my'>我的</van-tabbar-item>
            </van-tabbar>
        </footer>
    </div>
</template>

<script>
import { Toast } from 'vant';
export default {
    data() {
        return {
            active: 0,
        };
    },
}
</script>

<style lang='scss' scoped>
.home{
    width: 100%;
    height: 100%;
    main{
        width: 100%;
        height: calc(100% - 50x);
    }
    footer{
        width: 100%;
        height: 50px;
    }
}
</style>